﻿<Window x:Class="PaymentSystem.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:PaymentSystem"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800"
        xmlns:hc="https://handyorg.github.io/handycontrol" AllowsTransparency="True" WindowStyle="None" Background="{x:Null}" WindowStartupLocation="CenterScreen">
    <Window.Resources>
        <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
            <Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Style.BasedOn>
                <Style TargetType="{x:Type Button}">
                    <Setter Property="Background" Value="{DynamicResource RegionBrush}"/>
                    <Setter Property= "hc:BorderElement.CornerRadius" Value="4"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Button}">
                                <hc:SimplePanel>
                                    <Border Background="{TemplateBinding Background}" CornerRadius="60"/>
                                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="60">
                                        <StackPanel HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Orientation="Horizontal" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                            <Path x:Name="PathMain" Data="{TemplateBinding hc:IconElement.Geometry}" Fill="{TemplateBinding Foreground}" Height="{TemplateBinding hc:IconElement.Height}" Stretch="Uniform" SnapsToDevicePixels="True" Width="{TemplateBinding hc:IconElement.Width}"/>
                                            <Image Height="39.938" Width="39.952" Source="icons8-shopping-cart-64.png"/>
                                        </StackPanel>
                                    </Border>
                                </hc:SimplePanel>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="Content" Value="{x:Null}"/>
                                    <Trigger Property="hc:IconElement.Geometry" Value="{x:Null}">
                                        <Setter Property="Visibility" TargetName="PathMain" Value="Collapsed"/>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                    <Style.BasedOn>
                        <Style TargetType="{x:Type ButtonBase}">
                            <Setter Property="Height" Value="30"/>
                            <Setter Property="BorderBrush" Value="{DynamicResource BorgerBrush}"/>
                            <Setter Property="Padding" Value="10,6"/>
                            <Setter Property="Foreground" Value="{DynamicResource TextIconBrush}"/>
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="HorizontalAlignment" Value="Center"/>
                            <Setter Property="VerticalAlignment" Value="Center"/>
                            <Setter Property="HorizontalContentAlignment" Value="Center"/>
                            <Setter Property="VerticalContentAlignment" Value="Center"/>
                            <Style.BasedOn>
                                <Style TargetType="{x:Type Control}">
                                    <Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}"/>
                                    <Setter Property="FontSize" Value="12"/>
                                    <Setter Property="FocusVisualStyle">
                                        <Setter.Value>
                                            <Style>
                                                <Setter Property="Control.Template">
                                                    <Setter.Value>
                                                        <ControlTemplate>
                                                            <Rectangle RadiusY="4" RadiusX="4">
                                                                <Rectangle.Style>
                                                                    <Style TargetType="{x:Type Rectangle}">
                                                                        <Setter Property="Margin" Value="-2"/>
                                                                        <Setter Property="Opacity" Value="0.6"/>
                                                                        <Setter Property="SnapsToDevicePixels" Value="True"/>
                                                                        <Setter Property="Stroke" Value="{DynamicResource SecondaryBorderBrush}"/>
                                                                        <Setter Property="StrokeThickness" Value="2"/>
                                                                        <Setter Property="StrokeDashArray" Value="1 1"/>
                                                                    </Style>
                                                                </Rectangle.Style>
                                                            </Rectangle>
                                                        </ControlTemplate>
                                                    </Setter.Value>
                                                </Setter>
                                            </Style>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </Style.BasedOn>
                        </Style>
                    </Style.BasedOn>
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Opacity" Value="0.9"/>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter Property="Opacity" Value="0.6"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Opacity" Value="0.4"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Style.BasedOn>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="{DynamicResource SecondaryRegionBrush}"/>
                </Trigger>
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Background" Value="{DynamicResource BorderBrush}"/>
                </Trigger>
            </Style.Triggers>
        </Style>
        <Storyboard x:Key="Storyboard1">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Controls">
                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="rectangle">
                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="0.044"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="rectangle">
                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="-185"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="rectangle1">
                <EasingDoubleKeyFrame KeyTime="0" Value="220"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="355"/>
            </DoubleAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Banner1">
                <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
                <DiscreteObjectKeyFrame KeyTime="0:0:0.2" Value="{x:Static Visibility.Hidden}"/>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Banner2">
                <DiscreteObjectKeyFrame KeyTime="0:0:0.4" Value="{x:Static Visibility.Visible}"/>
            </ObjectAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="button">
                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="66"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </Window.Resources>
    <Window.Triggers>
        <EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button">
            <BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
        </EventTrigger>
    </Window.Triggers>
    <Grid>
        <Rectangle x:Name="rectangle" Fill="#ffa000" HorizontalAlignment="Left" Height="260" Margin="248,103,0,0" RadiusY="9.5" RadiusX="9.5" VerticalAlignment="Top" Width="387" RenderTransformOrigin="0.5,0.5">
            <Rectangle.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Rectangle.RenderTransform>
        </Rectangle>

        <Rectangle x:Name="rectangle1" Fill="White" HorizontalAlignment="Left" Height="355" Margin="60,50,0,0" VerticalAlignment="Top" Width="220" RadiusY="24.5" RadiusX="24.5"/>
        <Grid x:Name="Banner1" Margin="98,53,552,97">
            <Image HorizontalAlignment="Left" Height="190" VerticalAlignment="Top" Width="150" Source="axerve_illo_dribbble_3_2.jpg" Margin="-3,7,0,0"/>
            <TextBlock HorizontalAlignment="Left" Margin="-3,148,0,-32" TextWrapping="Wrap" Width="150" Foreground="#FF01466F" FontSize="24" FontFamily="Tw Cen MT"><Run Text="$ "/><Run FontWeight="Bold" FontSize="36" Text="59,99/"/><Run Text="в мес."/><LineBreak/><Run Foreground="Black" Text=". "/><Run Foreground="Black" FontSize="12" Text="10 пользователей"/><LineBreak/><Run Foreground="Black" Text=". "/><Run Foreground="Black" FontSize="12" Text="10.000 поисковых запросов"/><LineBreak/><Run Foreground="Black" Text=". "/><Run Foreground="Black" FontSize="12" Text="Минимум - 10 итераций"/></TextBlock>

        </Grid>
        <Grid x:Name="Banner2" Margin="80,75,415,120" Visibility="Hidden">
            <Image HorizontalAlignment="Left" Height="225" VerticalAlignment="Top" Width="215" Source="axerve_illo_dribbble_3_3.jpg" Margin="50,0,0,0"/>
            <TextBlock HorizontalAlignment="Left" Height="150" Margin="0,205,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="305" Foreground="#FF01466F" FontSize="24" FontFamily="Tw Cen MT" TextAlignment="Center"><Run FontWeight="Bold" FontSize="36" Text="Платёж принят"/><LineBreak/></TextBlock>
        </Grid>

        <Grid x:Name="Controls" Margin="300,103,175,129.137">
            <Image HorizontalAlignment="Left" Height="50" Margin="270,0,0,0" VerticalAlignment="Top" Width="55" Source="icons8-visa-an-american-multinational-financial-services-corporation-96 (1).png"/>
            <hc:TextBox hc:InfoElement.Placeholder="НОМЕР КАРТЫ" 
                ShowClearButton="True" TextType="Digits"  Margin="0,55,10,130.863"/>
            <hc:TextBox hc:InfoElement.Placeholder="ДЕРЖАТЕЛЬ КАРТЫ" 
                ShowClearButton="True"  Margin="0,117,10,65.863"/>
            <hc:TextBox hc:InfoElement.Placeholder="MM" 
                ShowClearButton="True"  Margin="0,182,253,0.863"/>
            <hc:TextBox hc:InfoElement.Placeholder="ГГ" 
                ShowClearButton="True"  Margin="77,182,170,0.863"/>
            <TextBlock HorizontalAlignment="Left" Height="23" Margin="0,32,0,0" TextWrapping="Wrap" Text="НОМЕР КАРТЫ" VerticalAlignment="Top" Width="135" Foreground="White"/>
            <TextBlock HorizontalAlignment="Left" Height="23" Margin="0,94,0,0" TextWrapping="Wrap" Text="ДЕРЖАТЕЛЬ КАРТЫ" VerticalAlignment="Top" Width="135" Foreground="White"/>
            <TextBlock HorizontalAlignment="Left" Height="23" Margin="0,159,0,0" TextWrapping="Wrap" Text="СРОК ДЕЙСТВИЯ КАРТЫ" VerticalAlignment="Top" Width="135" Foreground="White"/>
            <hc:TextBox hc:InfoElement.Placeholder="CVV" 
                ShowClearButton="True"  Margin="177,182.863,13,0"/>
            <TextBlock HorizontalAlignment="Left" Height="23" Margin="177,159.863,0,0" TextWrapping="Wrap" Text="CVV" VerticalAlignment="Top" Width="135" Foreground="White"/>
        </Grid>



        <Button x:Name="button" Content="Button" HorizontalAlignment="Left" Height="60" Margin="130,375,0,0" VerticalAlignment="Top" Width="60" Style="{DynamicResource ButtonStyle1}" Background="#ffa000" RenderTransformOrigin="0.5,0.5">
            <Button.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Button.RenderTransform>
        </Button>
    </Grid>
</Window>





